import Page from "@/components/page";
import React, { useState } from "react";
import { View, Text } from "@tarojs/components";
import { HideLoading, ShowFail, ShowLoading, ShowToast, ToPage } from "@/utils";
import Taro from "@tarojs/taro";
import http from "@/request";
import user from "@/store/user";
import CheckRadio from "./checkRadio";
import account from "@/store/account";

import "./index.scss"

const Login: React.FC = () => {

    const [isAllow, setIsAllow] = useState(false)
    const [redirectPath, setRedirectPath] = useState<string>('')


    const getWechatAuth = async _ => {
        if (!isAllow) {
            ShowToast('请确认同意《AI记账助理使用协议》！')
            return
        }
        ShowLoading()
        Taro.login({
            success: (res) => {
                http.post('/user/aiLedger/wechatLogin', {
                    code: res.code
                }).then(res => {
                    const { token } = res.data
                    if (token) {
                        user.updateInfo(res.data)
                        user.checkUserAuth('你的账户开启了身份验证功能，请验证后再使用').then(_ => {
                            account.doUpDateAccount()
                            ToPage(redirectPath || '/pages/home/index', true)
                        }).catch(err => {
                            ShowToast(err.msg)
                        })
                    }
                    HideLoading()
                }).catch(err => {
                    user.updateInfo({})
                    ShowFail(err.msg || '微信授权失败！')
                })
            },
            fail: () => {
                HideLoading()
            }
        })
    }
    const toAgreement = () => {
        Taro.navigateTo({
            url: '/pages/login-agreement/index'
        })
    }

    Taro.useLoad((params) => {
        if (params.redirect) {
            setRedirectPath(decodeURIComponent(params.redirect))
        }
    })

    return (<Page className="login-page flex-column flex-center card-background text-main-color">
        <View className="page-bg"></View>
        <View className="flex-column flex-center flex2">
            <View className="logo flex-row flex-item page-background">
                <View className="EN_text">AI</View>
                <View className="CN_text">
                    <View>记账助理</View>
                    <View>LEDGER</View>
                </View>
            </View>
            <View className="slogan font-size24">面包会有的，牛奶会有的，一切都会有的</View>
        </View>
        <View className="flex-column flex-center flex1">
            <View className="btns-container">
                <View className="btn-container flex-column flex-center">
                    <View className="auth-btn page-background" onClick={getWechatAuth}>立即登录</View>
                    <View className="allow-text flex-row flex-center">
                        <CheckRadio value={isAllow} onChange={setIsAllow}/>
                        <Text onClick={() => setIsAllow(val => !val)}>我已阅读并同意</Text>
                        <Text onClick={toAgreement} className="agreement">《[AI记账助理]使用协议》</Text>
                    </View>
                </View>
            </View>
        </View>
    </Page>)
}

export default Login